<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui">

<h:head>
</h:head>

<h:body>

<ui:composition template="/templates/Plantilla.xhtml">
	<ui:define name="content">			
		<h:form class="form" id="form">
		<h3 style="text-align: center; padding-bottom:35px;"> Alta de Sujetos Residenciales</h3>
		<h4 style="text-align: right;"> Paso 2 de 3</h4>
	
		<p:growl id="growl1" />
		
		<p:panelGrid columns="1" style="text-align: left;width:100%; " >
			<f:facet name="header"> Seleccione: Un Reparto y Dias de Visita</f:facet>
		</p:panelGrid>
		<p:panel>
				<br></br>
				<h:panelGrid columns="3" columnClasses="label, value" styleClass="grid">
					
					<h:outputText value="Reparto: *"/>
					<p:selectOneMenu id="reparto" value="#{sujetoResidencialCreate2.visita.reparto.repartoId}" required="true" effect="fade"  label="Reparto">  
			            <f:selectItem itemLabel="Seleccione un Reparto..." itemValue="" />  
			            <f:selectItems value="#{selectOneMany.getRepartos()}" var="reparto" 
							itemLabel="#{reparto.nombre}" 
							itemValue="#{reparto.repartoId}"></f:selectItems>
						<p:ajax update="errorReparto" event="change" />  
			        </p:selectOneMenu>
			        <p:message for="reparto"  id="errorReparto" ></p:message>
			         
					<h:outputText id="lblVisita" value="Dia de visita: *"/>
					<p:selectManyCheckbox id="visita" value="#{sujetoResidencialCreate2.diasSeleccionados}" required="true" label="Dia de Visitas">  
			            <f:selectItems value="#{sujetoResidencialCreate2.getDiasSemanales()}" />
			            <p:ajax update="errorVisita" event="change" />
			        </p:selectManyCheckbox>
			        <p:message for="visita"  id="errorVisita" ></p:message>
				</h:panelGrid>
				<br></br>
				<br></br>
		</p:panel>
      	<p:panelGrid columns="1" style="width:100%;"  >
			<f:facet name="header" style="text-align: left;"> Seleccione: Productos y Packs</f:facet>
		</p:panelGrid>
	     
	     	<p:tabView id="tabView">
				<p:tab  title="Productos">
					<br></br>
					<p:dataTable id="tblProductos"	value="#{sujetoResidencialCreate2.listaProductoPrecio}"
						var="p" paginator="true" rows="10" rowKey="#{p.productoId}"
						selection="#{sujetoResidencialCreate2.productosSeleccionados}">  			
			  			
			  			<f:facet name="header">Productos Disponibles</f:facet> 
						
						<p:column selectionMode="multiple">
						</p:column>

			  			<p:column sortBy="#{p.nombre}">
			  				<f:facet name="header">Nombre</f:facet>
			  				#{p.nombre}
			  			</p:column>
			
			  			<p:column>
			  				<f:facet name="header">Precio</f:facet>
			  				#{p.precio}
			  			</p:column>
			  			
			  			<p:column >
			  				<f:facet name="header">Tipo</f:facet>
			  				#{p.tipoProducto.nombre}
			  			</p:column>
			  			
					</p:dataTable>
				</p:tab>
				<p:tab title="Packs" >
				 <br></br>
					
					<h:panelGrid columns="2" columnClasses="label, value" styleClass="grid">
						<h:outputText value="Packs: *"/>
						<p:selectOneMenu id="pack" value="#{sujetoResidencialCreate2.comPack.pack.packId}" label="Packs">
				            <f:selectItem itemLabel="Seleccione un Pack..." itemValue="0" />  
				            <f:selectItems value="#{selectOneMany.getPacks()}" var="p" 
								itemLabel="#{p.nombre}" 
								itemValue="#{p.packId}">
							</f:selectItems>  
							
				        </p:selectOneMenu>
						
						<h:outputText value="Cantidad de Packs: *"/>
						 <p:spinner id="spinnerBasic" value="#{sujetoResidencialCreate2.comPack.cantidadPack}" min="1" />  
					</h:panelGrid>
					<br></br>
				   <p:dataTable id="tblFrioCalor1" value="#{sujetoResidencialCreate2.listaFrioCalor}"
							var="fc" rowKey="#{fc.frioCalorId}" selectionMode="single"
							selection="#{sujetoResidencialCreate2.frioCalorSeleccionado}"
							paginator="true" rows="10" >  			
				 			
				 		<f:facet name="header">Frio Calor Disponibles</f:facet>
						
						<p:ajax event="rowSelect" listener="#{sujetoResidencialCreate2.onRowSelect}"
                   			 oncomplete="carDialog.show()" update=":form:tabView:displays"/>

	
						<p:column headerText="Serie Nº" sortBy="#{fc.numeroDeSerie}">
							#{fc.numeroDeSerie}
						</p:column>
				
						<p:column headerText="Marca">
							<f:facet name="header">Marca</f:facet>
							#{fc.marca}
						</p:column>
						
						<p:column headerText="Modelo">
							#{fc.modelo}
						</p:column>
					</p:dataTable>
					
					<p:dialog id="dialog1" header="Ingrese la Ubicacion del equipo Frio Calor" widgetVar="carDialog" resizable="false"> 
					       <h:panelGrid id="displays" columns="2" cellpadding="4">  

 								<h:outputText value="Numero de Serie" />  
					            <h:outputText id="inputNumeroDeSerie" value="#{sujetoResidencialCreate2.frioCalorSeleccionado.numeroDeSerie}" />

								<h:outputText value="Marca" />  
					            <h:outputText id="inputMarca" value="#{sujetoResidencialCreate2.frioCalorSeleccionado.marca}" />

					            <h:outputText value="Ubicacion" />  
					           
					  			<p:inputTextarea id="inputObservacion" value="#{sujetoResidencialCreate2.ubicacion}" autocomplete="off" 
					  			onkeyup="javascript:this.value=this.value.toUpperCase();"/>
					       </h:panelGrid>  
					          <br></br>
					       <p:commandButton id="confirm" value="Agregar" oncomplete="dialog1.hide()"  
					                    actionListener="#{sujetoResidencialCreate2.agregarEquipo()}" update="tblFrioCalor1" ajax="false"/>  
					</p:dialog>  
					
					<br></br>
					<br></br>
					<p:dataTable id="tblFrioCalor11" value="#{sujetoResidencialCreate2.listaFrioCalorSeleccionados}"
							var="fcc" rows="10" 
							selection="#{sujetoResidencialCreate2.frioCalorSeleccionado1}" >  			
				 			
				 		<f:facet name="header">Frio Calor Seleccionados</f:facet>
	
						<p:column headerText="Serie Nº" sortBy="#{fcc.numeroDeSerie}">
							#{fcc.numeroDeSerie}
						</p:column>
						
						<p:column headerText="Marca">
							<f:facet name="header">Marca</f:facet>
							#{fcc.marca}
						</p:column>
						
						<p:column headerText="Modelo">
							#{fcc.modelo}
						</p:column>
						
						<p:column headerText="Ubicacion">
							#{fcc.ubicacion}
						</p:column>
						<p:column style="width:4%"> 
                			<p:commandLink  id="selectButton" update="tblFrioCalor11"  
                								 actionListener="#{sujetoResidencialCreate2.quitarEquipoListener(fcc)}" ajax= "false">  
                					<p:graphicImage value="#{resource['images:cross-16-ns.png']}"/>	
           
            				</p:commandLink>  
						</p:column> 
					</p:dataTable>
					
				</p:tab>
			</p:tabView>
	
		<p:panel style = "text-align:center">
				<p:commandButton value="Atras" action="#{sujetoResidencialCreate2.cargarSujeto(sujetoResidencialCreate2.sujeto)}" ajax="false" immediate="true"/>
				<p:commandButton value="Siguente" action="#{sujetoResidencialCreate2.cargarResumen}" ajax="false" />

			</p:panel>  	    		
		</h:form>        	        	        	        
	</ui:define>
	
</ui:composition>
	
</h:body>
</html>